#mydiv{
   z-index: -1;
   background-color: #f1f1f1;

    
}
/*头部 */
header {

    height: 65px;
    padding: 0 30px;
    border-bottom: 2px solid #aec7ec;
    width: 100%;
    z-index: 999;
}

/* logo */
header div img {
    margin-top: 20px;
    width: 230px;
    height: 30px;
}

/* 菜单栏 */
header .menu {
    left: 50%;
    transform: translateX(-50%);
}

header .menu li {
    float: left;
    line-height: 61px;
    margin: 0 20px;
}

header .menu li a {
    color: black;
}

header .menu .active {
    border-bottom: 3px solid #4dd1ff;
    color: #00bdff;
}

/* 登录按钮 */
header .right-box {
    margin-top: 20px;
}

header .right-box a {
    display: inline-block;
    height: 24px;
    border-radius: 12px;
    border: 1px solid #fff;
    padding: 0 15px;
    color: #fff;

}

header .right-box a:nth-child(1) {
    color: black;
    border: 1px #888 solid;
}

header .right-box a:last-child {
    background-color: #ed510a;
    margin-left: 10px;
    border: 1px solid #ed510a;
}
/* banner */
.banner{
    height: 410px;
    padding-top: 100px;
   
}
.banner div{
    width: 260px;
    height: 270px;
    padding-top: 50px;
    background-color: #fff;
}
.banner>div>img{
    width: 120px;
    height: 100px;
    margin-left: 64px;
    margin-bottom: 50px;
    margin-top: 0 ;
}
.banner>div>h1>img{
    width: 14px;
    height: 14px;
}

.banner>div>h1>img{
margin-left: 50px;
margin-top: 0;
}
.banner>div>h2>span{
    font-weight: lighter;
}
.banner>div>h2>span:nth-child(1){
 margin-left:45px ;
}
.banner>div>h2>span:nth-child(2){
 margin-left:30px ;
}
.banner>div>h2>span:nth-child(3){
 margin-left:30px ;
}
/* banner右侧 */
.banner ul{
    margin-left: 50px;
}
.banner ul li:nth-child(1){
    font-size: 20px ;
    font-weight: bold;
    margin-bottom: 10px;
    margin-top: 6px;
  
}
.banner ul li:nth-child(1) span{
    display: inline-block;
    width: 74px;
    height: 21px;
    font-size: 14px;
    line-height: 21px;
    position: relative;
    top:0 ;
    color: #00bdff;
    border: 1px solid #00bdff;
    margin-left: 10px;
}
.banner ul li:nth-child(2){
    color: #ffa214;
    line-height: 24px;
    margin-bottom:10px ;
}
.banner ul li:nth-child(2) span:nth-child(1){

    display: inline-block;
    margin-top: 0px;
    margin-right: 5px;
    width: 20px;
    height: 20px;
    background: url(../images/API详情页_03.jpg);
    background-size: 20px 20px;
    position: relative;
    top: 4px;
    font-weight: bolder;
}
.banner ul li:nth-child(2) span:nth-child(2){

    display: inline-block;
    margin-top: 0px;
    margin-left: 30px;
    width: 20px;
    height: 20px;
    background: url(../images/API详情页_08.jpg);
    background-size: 20px 20px;
    position: relative;
    top: 4px;
    font-weight: bolder;
}
.banner ul li:nth-child(2) span:nth-child(3){
    position: relative;
    top: 4px;

    display: inline-block;
    margin-top: 0px;
    margin-left: 30px;
    width: 20px;
    height: 20px;
    background: url(../images/API详情页_05.jpg);
    background-size: 20px 20px;
    font-weight: bolder;
}
.banner ul li:nth-child(4) span:nth-child(1) img{
    width: 13px;
    height: 13px;
   
}
.banner ul li:nth-child(3) div{
    font-weight: lighter;
}
.banner ul li:nth-child(4){
    margin-top: 10px;
    position: relative;
    cursor: pointer;
}
.banner ul li:nth-child(4) span span{
   width: 120px;height: 140px;
   text-align: center;
   position: absolute;
   top: 25px;
   left: 0;
   display: none;

}
.banner ul li:nth-child(4) span:nth-child(1){
    color: #00bdff;
}
.banner ul li:nth-child(4) span:hover #imgs{
    display: block ;
}
.banner ul li:nth-child(4) span #imgs img{
    width: 100px;
    height: 100px;
}
.banner ul li:nth-child(4) span{
    font-size: 14px;
    border: 1px solid #999;
    padding: 5px 5px;
   
    margin-right:12px ;
}
.banner ul li:nth-child(4) span.blue{
   
    border: 1px solid #00bdff;
  color: #00bdff;
  background: url(../images/select.png) no-repeat bottom right;
  
   
}
.banner ul li:nth-child(5){
    font-size: 14px;
    margin-top: 18px;
}
.banner ul li:nth-child(5) span{

   font-size: 16px;
   color: red;
   margin-right: 5px;
}
.banner ul li:nth-child(6) span{
    display: block;
    width: 120px;
    height: 40px;
    text-align: center;
    line-height: 40px;
    color: #fff;
    background-color: #00bdff;
    margin-top: 30px;
}
/* API文档栏 */
.main {
    height: 46px;
    line-height: 46px;
    font-size: 20px;
    border-bottom: 1px solid #999;
    margin-bottom: 50px;

}
.main div span{
    height: 45px;
    display: inline-block;
    margin-right: 100px;
    cursor: pointer;
}
.main div span.active{
    color: #00bdff;
    border-bottom: #00bdff 2px solid;
}
/* 测试工具栏 */
.section ul li{
    line-height: 40px;
}
.section ul{
    margin-bottom: 10px;

}
.section h1{
    width: 150px;
    height: 35px;
    text-align: center;
    line-height: 35px;
    color: #fff;
    background-color: #00bdff;
    margin-bottom: 50px;
}
/* 表格栏 */
.section{
    display: none;
    
}
.on{
    display: block;
}
.article div{
    position: relative;
    margin-bottom: 10px;
    line-height: 20px;
    height: 20px;
    padding-left: 15px;
}
.article div span{
    position: absolute
    ;
    left: 3px;
    top: 2px;
    display: inline-block;
    width: 4px;
    height: 20px;
    background-color: #00bdff;
   
}
.article table tr:nth-child(1){
    background-color: #fbfbfb;
}
.article table{
    border: 1px solid #999;
    margin-bottom: 50px;
}
.article table tr td{
width: 150px;
height: 33px;
padding-left: 20px;


}
.article table tr td:nth-child(4){
    width: 600px;
}
.article table tr {
    border-bottom: 1px solid #999;
}
.article p{
    width: 920px;height: 390px;
    background-color: #fafafa;
    line-height: 34px;
}
/*侧边栏 */
aside{
    position: absolute;
    top: 0;
    right: -80px;
    margin-bottom: 50px;
}
aside ol li{
    width: 220px;
    padding: 10px 0px;
    border-bottom: 1px #999 initial;
    height: 80px;
}
aside ol li span{
    display: block;
    width: 60px;
    height: 60px;
    text-align: center;
    line-height: 60px;
    border: 1px solid #999;
    padding-top: 8px;
    margin-right: 10px;
}
aside ol li h2{
    margin-bottom: 5px;
    font-weight: bold;
}
aside ol li h5{
    text-overflow: ellipsis;
    white-space:nowrap;
    overflow: hidden;
}
/* 尾部 */
.footer-top{
    height: 150px;
    background-color: #00bdff;
    color: #fff;
    text-align: center;
    margin-top: 50px;
}
.footer-top div{
    padding-top: 30px;
}
.footer-top h1{
    font-size: 30px ;
    margin-bottom:  20px;
}
.footer-top h2{
    font-size: 20px ;
    width: 146px;
    height: 40px;
    border: 1px solid #fff;
    text-align: center;
    line-height: 40px;
    margin: 0 auto;
}











footer{
    height: 300px;
}
